<div id="tb<?php echo $uniqid;?>">
    <table cellspacing="0" cellpadding="0">
        <tbody>
        <tr>
            <td><a href="javascript:void(0);" onclick="selectcategoriesReload();" class="l-btn l-btn-small l-btn-plain"><span
                    class="l-btn-left l-btn-icon-left"><i class="iconfont icon-shuaxin"></i><span class="l-btn-text">重载</span></span></a></td>
            <td><span style="line-height:30px;"></span>
                <input id="selectcategorieskeywords" style="width:120px" placeholder="按ID、商品名搜索" type="text"
                                   class="easyui-input textbox"></td>
            <td><a href="javascript:void(0);" onclick="selectcategoriesSearch();" class="l-btn l-btn-small l-btn-plain"><span
                    class="l-btn-left l-btn-icon-left"><i class="iconfont icon-sousuo"></i><span class="l-btn-text">查询</span></span></a></td>
        </tr>
        </tbody>
    </table>
</div>
<div class="con"  style="-moz-user-select:none;">
    <table id="selectcategories"></table>
</div>
<script>
    var selectcategoriesReload = function () {
        $("#selectcategories").datagrid('reload');
    };
    var selectcategoriesSearch = function (id) {
        var height = 520 - 96;//表格高度
        var width = 840 - 2;
        $("#selectcategories").treegrid({
            width: width,
            height: height,//高度
            singleSelect: false,//如果为true，则只允许选择一行
            striped: true,//是否显示斑马线效果。
            rownumbers: false,//如果为true，则显示一个行号列。
            pagination: true,//是否显示分页
            pageSize: 15,
            pageList: [15, 30, 40, 50],
            method: 'post',
            sortName: 'weigh',
            sortOrder: 'desc',
            url: '/admin/decorate/selectcategory',
            queryParams: {
                keywords: $('#selectcategorieskeywords').val(),
            },
            fitColumns: true,//真正的自动展开/收缩列的大小，以适应网格的宽度，防止水平滚动。
            nowrap: false,//如果为true，则在同一行中显示数据。设置为true可以提高加载性能。 是否换行
            selectOnCheck: true,
            checkOnSelect: true,
            idField: 'id',
            treeField: 'name',
            toolbar: '#tb<?php echo $uniqid;?>',
            columns: [[
                {field: 'id', checkbox: true, width: '5%'},
                {field: 'ids', width: '5%', formatter:function (value, rowData){
                        return rowData.id;
                    }},
                {field: 'name', title: '名称', width: fixWidth(20)},
                {field: 'image', title: '图片', align:'center', width: fixWidth(7), formatter:function (value){
                        return "<img src='" + value + "' height='35px' style='border-radius: 5px;' />";
                    }},
                {field: 'weigh', title: '排序', width: fixWidth(5)},
            ]],
        });
    };
    selectcategoriesSearch();
    onTreegridResize("#selectcategories");

    $('#dodecoratesubmit').click(function(data){
        let cates = $('#selectcategories').treegrid('getSelections');
        if(cates){
            let data = {
                id: '',
                category_arr: cates,
            };
            let ids = [];
            cates.forEach((it)=>{
                ids.push(it.id);
            });
            data.id = ids.join(',');
            decorateVm.selectedCategories(data);
            $("#dodecoratedlg").dialog('close');
        }else{
            $.messager.alert('提示', '请先选择分类！', 'warning');
        }
    })
</script>
